import ExtractTextPlugin from "extract-text-webpack-plugin";
import nodeModulesExternals from "webpack-node-externals";
import HTMLPlugin from "html-webpack-plugin";
import OptimizeCssAssetsPlugin from "optimize-css-assets-webpack-plugin";
import { HotModuleReplacementPlugin } from "webpack";

export const jsx_loader = ({ test }) => ({
    test: test || /\.(jsx|js)$/,
    loader: "babel-loader",
    exclude: /node_modules/,
    options: {
        presets: [["env", { modules: false }], "react"],
        plugins: ["transform-object-rest-spread"]
    }
});
export const js_loader = ({ test }) => ({
    test: test || /\.js$/,
    loader: "babel-loader",
    exclude: /node_modules/,
    options: {
        presets: [["env", { modules: false }]],
        plugins: ["transform-object-rest-spread"]
    }
});
export const scss_loader = ({ test, extract }) => ({
    test: test || /\.scss$/,
    use: extract ? ExtractTextPlugin.extract({
        use: ["css-loader", "autoprefixer-loader", "sass-loader"],
        fallback: "style-loader"
    }) : ["style-loader", "css-loader", "autoprefixer-loader", "sass-loader"]
});
export const fonts_loader = ({ test }) => ({
    test: test || /\.woff2?$|\.(ttf|eot)$/,
    loader: "url-loader",
    options: {
        name: "[hash:16].[ext]",
        outputPath: "font/",
        publicPath: (url) => {
            let filename = url.lastIndexOf("/") > -1 ? url.substring(url.lastIndexOf("/") + 1) : url;
            return "font/" + filename;
        },
        limit: 8192
    }
});
export const images_loader = ({ test }) => ({
    test: test || /\.(png|jpg|jpeg|gif|svg)$/,
    loader: "url-loader",
    options: {
        name: "[hash:16].[ext]",
        outputPath: "img/",
        publicPath: (url) => {
            let filename = url.lastIndexOf("/") > -1 ? url.substring(url.lastIndexOf("/") + 1) : url;
            return "img/" + filename;
        },
        limit: 8192
    }
});
export const raw_loader = ({ test }) => ({
    test: test || /\.md$/,
    loader: "raw-loader"
});
export const vue_loader = () => ({
    test: /\.vue$/,
    loader: "vue-loader",
    options: {
        preserveWhitespace: false,
        loaders: {
            scss: "sass-loader"
        }
    }
});

export const extract_plugin = ({ filename }) => (new ExtractTextPlugin({
    filename: filename || "index.css",
    allChunks: true
}));
export const optimize_css_plugin = () => (new OptimizeCssAssetsPlugin());
export const uglify_plugin = ({ beautify }) => (new webpack.optimize.UglifyJsPlugin({
    mangle: true,
    compress: {
        warnings: false,
        drop_console: true,
        drop_debugger: true,
        pure_funcs: ["console.log", "window.console.log", "window.console.log.apply"]
    },
    comments: false,
    sourceMap: false,
    beautify: beautify || false
}));
export const html_plugin = ({ template, filename }) => (new HTMLPlugin({
    template: template || __dirname + "/src/index.html",
    filename: filename || "index.html"
}));
export const hot_plugin = () => (new HotModuleReplacementPlugin());

export const jquery_external = {
    commonjs2: "jquery",
    commonjs: "jquery",
    amd: "jquery",
    root: "jQuery"
};
export const react_external = {
    commonjs2: "react",
    commonjs: "react",
    amd: "react",
    root: "React"
};
export const lodash_external = {
    commonjs2: "lodash",
    commonjs: "lodash",
    amd: "lodash",
    root: "_"
};
export const react_router_external = {
    commonjs2: "react-router-dom",
    commonjs: "react-router-dom",
    amd: "react-router-dom",
    root: "ReactRouterDOM"
};